<template>
  <div class="header">
    <div class="title">
      {{ currentWindowIsGroup ? groupList[currentWindowObject].name : onLineList[currentWindowObject].username }}
    </div>
  </div>
</template>

<script>
import { mapState } from 'vuex'
export default {
  name: 'Head',
  computed: {
    ...mapState([
      'groupList',
      'currentWindowIsGroup',
      'onLineList',
      'currentWindowObject'
    ])
  }
}
</script>

<style lang="stylus" scoped>
  .header
    height 25px
    padding 10px 0
    margin 0 20px
    border-bottom 1px solid #ccc
    .title
      font-size 16px
      font-weight 600
      color #777
      text-align center
      line-height 25px
</style>
